<template>
  <view class="u-p-t-20" :style="my_style">
    <view class="u-p-l-24 u-p-r-24">
      <view class="bg-white radius-16 u-p-t-22 u-p-l-40 u-p-r-38 u-p-b-20">
        <view class="font-28 gray-color">提现到账账户</view>
        <view class="flex-between u-m-t-42">
          <view class="flex">
            <image class="w-80 h-80" :src="user.wx_headimg" />
            <text class="font-32 black-color u-m-l-32">{{ user.wx_nickname }}</text>
          </view>
          <view>
            <u-icon name="checkmark-circle-fill" size="45rpx" color="#FB2D19"></u-icon>
          </view>
        </view>
      </view>
    </view>

    <view class="u-p-l-30 u-p-r-30 u-m-t-20">
      <view class="bg-white radius-16 u-p-t-40 u-p-l-18 u-p-r-18 u-p-b-20">
        <view class="font-28 gray-color u-m-l-16">提现金额</view>
        <view class="flex u-m-l-58 black-color">
          <text class="font-56">¥</text>
          <input v-model.number="number" type="number" class="u-m-l-20 h-198 font-65 red-color" />
        </view>
        <view class="border-bottom1"></view>
        <view class="font-24 gray-color flex-between u-p-l-16 u-p-r-14 u-p-t-24">
          <text>可提现余额 ¥ {{ user.balance }}</text>
          <text class="black-color" @click="number = user.balance">全部提现</text>
        </view>
      </view>
    </view>

    <view class="btns">
      <view class="btn" @click="applyMoneyWithdraw">立即提现</view>
    </view>

    <view class="font-28 gray-color xy"
      >提现即为同意 <text class="black-color">《提现协议》</text></view
    >
  </view>
</template>

<script>
  export default {
    name: 'withdrawal',
    data() {
      return {
        number: 0,
        balance: {},
        userinfo: {},
      }
    },
    onLoad() {
      this.getMemberAccountInfo()
    },
    methods: {
      jumpPage(url) {
        uni.$u.route(url)
      },
      // 用户财务-用户账户信息
      async getMemberAccountInfo() {
        const res = await this.$api.common.user('getMemberAccountInfo', {
          account_type: 'balance',
        })
        if (res.code === 200) {
          this.balance = res.data
        }
      },
      async applyMoneyWithdraw() {
        if (this.number <= 0) {
          return
        }
        let params = {
          apply_money: this.number,
          transfer_type: 'wechatpay',
          app_type: 'weapp',
        }
        const res = await this.$api.common.user('applyMoneyWithdraw', params)
        if (res.code === 200) {
          this.replaceJump('/views/user/withdrawal/withdrawal_state')
        }
      },
    },
  }
</script>

<style lang="scss" scoped>
  .btns {
    z-index: 1;
    width: 100%;
    padding: 0 30rpx;
    margin-top: 94rpx;
    box-sizing: border-box;

    .btn {
      height: 88rpx;
      font-family: PingFangSC-Medium, PingFang SC;
      font-size: 32rpx;
      font-weight: 500;
      line-height: 88rpx;
      color: #fff;
      text-align: center;
      background-color: var(--color);
      border-radius: 49rpx;
    }
  }

  .xy {
    position: fixed;
    bottom: 40rpx;
    left: 0;
    width: 100vw;
    text-align: center;
  }
</style>
